<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>首页</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="assets/css/boots.css"/>
		<link rel="stylesheet" type="text/css" href="assets/css/reset.css"/>
		<link rel="stylesheet" type="text/css" href="assets/css/template.css"/>
		<link rel="stylesheet" href="//at.alicdn.com/t/font_1032962_iwtc7l9dib8.css" />
		<link rel="stylesheet" type="text/css" href="assets/css/index.css"/>
		<script  type="text/javascript" src="assets/js/view.js"></script>
	</head>
	<body onload="load()">
		<div class="loading" id="loading">
			<div class="p_wrap">
				<p>L</p>
				<p>O</p>
				<p>A</p>
				<p>D</p>
				<p>I</p>
				<p>N</p>
				<p>G</p>
			</div>
		</div>
		<script type="text/javascript">
			//loading
			function load(){
			var a= setTimeout("loading.style.transition='opacity 0.2s'",1000) 
			//设置透明度改变的过渡时间为0.3秒
			var b= setTimeout("loading.style.opacity=0",3000)
			//0.5秒后加载动画开始变为透明
			var c= setTimeout("loading.style.display='none'",4000)
			//当透明度为0的时候，隐藏掉它
			}
		</script>
		<div class="web_wrap">
				<header>
					<div class="header">
						<label class="drop_down" for="navBtn">
								<img src="assets/img/index/dropd.png"/>
							</label>
						<div class="logo">
							<a href="index.html"><img class="logo_i" src="assets/img/index/logo.png" alt="" /></a>
						</div>
						<label class="search" for="searBtn">
							<img src="assets/img/index/serch.png" alt="" />
						</label>
					</div>
				</header>
			<div class="web">
				<div class="center">
					<div class="banner">
						<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
						<ol class="carousel-indicators li_rad">
							<li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
							<li data-target="#carousel-example-generic" data-slide-to="1"></li>
							<li data-target="#carousel-example-generic" data-slide-to="2"></li>
						</ol> 

						<div class="carousel-inner" role="listbox">
							<div class="item active img">
								<img src="assets/img/index/index_03.jpg" alt="" />
								<a class="btn" href="">SEE MORE</a>
							</div>
							<div class="item img">
								<img src="assets/img/index/index_03.jpg" alt="" />
								<a class="btn" href="">SEE MORE</a>
							</div>
							<div class="item img">
								<img src="assets/img/index/index_03.jpg" alt="" />
								<a class="btn" href="">SEE MORE</a>
							</div>
						</div>
					</div>
					<!--<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
					  <ol class="carousel-indicators">
					    <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
					    <li data-target="#carousel-example-generic" data-slide-to="1"></li>
					    <li data-target="#carousel-example-generic" data-slide-to="2"></li>
					  </ol>
					  <div class="carousel-inner" role="listbox">
					    <div class="item active">
					      	<img src="assets/img/index/index_03.jpg" alt="" />
							<a class="btn" href="">SEE MORE</a>
					    </div>
					    <div class="item">
					      <img src="assets/img/index/index_03.jpg" alt="" />
							<a class="btn" href="">SEE MORE</a>
					    </div>
					    <div class="item">
					      <img src="assets/img/index/index_03.jpg" alt="" />
							<a class="btn" href="">SEE MORE</a>
					    </div>
					  </div>
					</div>-->
					</div>
					<div class="about">
						<a href="about.html">About Or</a>
						<div class="img">
							<img src="assets/img/index/index_07_07.jpg"/>
							<a class="btn" href="">SEE MORE</a>
						</div>
					</div>
					<div class="product">
						<a href="product.html">Product</a>
						<div class="img_top">
							<div class="img_left">
								<div class="img_i">
									<img src="assets/img/index/index_10.jpg"/>
								</div>
								<div class="text">
									<span>Dot. Multi-functional </span>
									<p>Dot. Multi-functional Combine-unit</p>
								</div>
							</div>
							<div class="img_right">
								<div class="img_i">
									<img src="assets/img/index/index_12.jpg"/>
								</div>
								<div class="text">
									<span>free collocation</span>
									<p> Dot. Table</p>
								</div>
							</div>
						</div>
						<div class="img_foot">
							<div class="img_left">
								<div class="img_i">
									<img src="assets/img/index/index_15.jpg"/>
								</div>
								<div class="text">
									<span>free collocation</span>
									<p> Dot. Table</p>
								</div>
							</div>
							<div class="img_right">
								<div class="img_i">
									<img src="assets/img/index/index_17.jpg"/>
								</div>
								<div class="text">
									<span>free collocation</span>
									<p> Dot. Table</p>
								</div>
							</div>
						</div>
					</div>
					<div class="video">
						<span>Product of the day</span>
						<p>Dot. Multi-functional Combine-unit</p>
						<div class="img">
							<div class="mask"></div>
							<img src="assets/img/index/index_21.jpg"/>
						</div>
						<a class="btn" href="">SEE MORE VIDEOS</a>
					</div>
					
				</div>
				<footer>
					<div class="footer">
						<div class="img">
							<img src="assets/img/index/index22_06.jpg" alt="" />
							<div class="mask"></div>
						</div>
						<div class="foot_con">
							<div class="text">
								<p>Copyright (c) Nissin Furniture Crafters Co ,Ltd All Rights Reserved</p>
								<a class="iconfont icon-icon_jiantou-shang" href=""></a>
							</div>
						</div>
					</div>
				</footer>
			</div>
		</div>
		<input type="checkbox" name="navBtn" id="navBtn" value="" />
		<div class="popup">
			<div class="close">
				<label for="navBtn">
					<img src="assets/img/index/close.png" alt="" />
				</label>
			</div>
			<div class="link">
				<div class="link_img">
					<img src="assets/img/index/ic (4).png"/>
					<img src="assets/img/index/ic (1).png"/>
					<img src="assets/img/index/ic (2).png"/>
					<img src="assets/img/index/ic (3).png"/>
				</div>
				<div class="nav">
					<ul class="nav_link">
						<a href="about.html"><li>About Or</li></a>
						<a href="product.html"><li>Product</li></a>
						<a href="room.html"><li>Space Inspiration</li></a>
						<a href="ugc.html"><li>User Experience</li></a>
					</ul>
					<ul class="subnav">
						<a href="news.html"><li>News</li></a>
						<a href="activity_detail.html"><li>EVENT</li></a>
						<a href="Contact_us.html"><li>CONTACT</li></a>
					</ul>
				</div>
			</div>
		</div>
		<input type="checkbox" name="searBtn" id="searBtn" value="" />
		<div class="searchW">
			<div class="searchb">
				<label class="rebtn" for="searBtn">
					<span>&larr;</span>Return
				</label>
				<div class="con">
					<input type="text" autofocus="autofocus" value="" />
					<div class="text">
						<p>Searh anything & hit enter</p>
					</div>
				</div>
			</div>
		</div>
		
		
	</body>
<script src="http://www.lanrenzhijia.com/ajaxjs/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
	<script type="text/javascript">
		$(document).on("scroll", function() {
		if($(document).scrollTop() > 50) {
			$(".logo_i").addClass("logo_b");
		} else {
			$(".logo_i").removeClass("logo_b");
		}
		});
	</script>
</html>
